@media only screen and (max-width:720px) {
  #index-video {
    display: none !important;
  }
}


@media only screen and (min-width: 720px) {
  #index-video {
    display: block !important;
  }
}



.background {
  position: absolute;
  width: 100%;
  height: 100vh;
  overflow: hidden;

  .bg-wave-svg {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 100%;

    path {
      fill: #fff;
    }
  }

  .bg-cover {
    position: absolute;
    width: 100%;
    height: 100%;
    background: url('https://cdn.jsdelivr.net/gh/Redloney/CDN@1.7/static/img/t0152a0c82119427ba2.jpg');
    background-size: cover;
    background-position: center;
    filter: saturate(120%);

    &::before {
      position: absolute;
      width: 100%;
      height: 100%;
      display: block;
      left: 0;
      top: 0;
      z-index: 1;
      background: linear-gradient(45deg, rgba(0, 0, 0, .1), rgba(101, 147, 185, 0.281));
      content: "";
    }
  }

  .bg-video {

    video {
      height: 100vh;
      width: 100%;
      object-fit: cover;
    }

    img {
      height: 100vh;
      width: 100%;
      object-fit: cover;
    }

    .hidden {
      opacity: 0;
      z-index: -100;
    }
  }
}